import QtQuick 1.1
import com.nokia.meego 1.0

ListView {
    id: root
    width: 300
    height: 500
    clip: true

    footer: Item {
        id: footer
        width: ListView.view.width
        height: footer.more ? contents.height * 1.2 : 1
        opacity: 0.5
        visible: height > 1
        clip: true
        Row {
            id: contents
            visible: footer.height > 1
            anchors.centerIn: parent
            BusyIndicator { id: loading; running: footer.more }
            Label {
                id: message
                text: qsTr('Loading...')
                platformStyle: LabelStyle { fontPixelSize: constants.fontDefaultSize }
            }
        }
        onYChanged: {
            opacity = (y == 0 ? 0.5 : 1.0)
        }

        property bool more: !ListView.view.model.atEnd && footer.height > 0 && footer.y > 0 && footer.y < ListView.view.contentY + ListView.view.height

        onMoreChanged: {
            if (more) {
                if (footer.opacity > 0.5) {
                    ListView.view.model.more()
                }
                footer.opacity = (ListView.view.model.atEnd ? 1.0 : 0.5)
            }
        }

        states: [
            State {
                name: "at end"
                when: ListView.view.model.atEnd
                PropertyChanges {
                    target: footer
                    height: 0
                    visible: false
                }
            }
        ]
        onStateChanged: console.debug('state', state)
    }
}
